import { getAppData, setGlobalData } from '@utils/tools'
import { BasePage } from '@common/components/base-page'
import type CustomTabBar from '../../custom-tab-bar'
import { View, Text, Image } from '@tarojs/components'
import Taro from '@tarojs/taro'
import IQRequest from '@common/iq-request/request'
import Jump from '@utils/jump'
import AppRoute from '@utils/route/index'
import defaultAvatar from '../../assets/img/user-avatar.png'
import avatar1 from '../../assets/img/avatar1.png'
import mes from '../../assets/img/mes.png'
import female from '../../assets/img/female.png'
import edit from '../../assets/img/edit.png'
import badge from '../../assets/img/badge.png'
import arrow from '../../assets/img/right-arrpw.png'
// import './index.scss'
import style from './index.module.scss'

interface IProps { }
interface IState {
    checking: Boolean;
    userInfo: any
}

export default class User extends BasePage<IProps, IState> {
    constructor(props) {
        super(props);
        this.state = {
            //审核中
            checking: true,
            userInfo: {}
        }
    }
    componentDidShow() {
        const pageCtx = Taro.getCurrentInstance().page
        const tabbar = Taro.getTabBar<CustomTabBar>(pageCtx)
        tabbar?.switchTab(3)
        setGlobalData({
            tabIndex: 3
        })
        this.setState({
            userInfo: Taro.getStorageSync('userInfo') || {}
        })
        console.log('tabIndex', Taro.getStorageSync('userInfo'))
    }
    // <View onClick={this.handleClick}>个人页面</View>
    render() {
        const { checking, userInfo } = this.state
        return (
            <>
                <View className={`${style.center} ${style.base}`}>
                    <View className={style.leftAvatar}>
                        {
                            <View className={style.mask}>
                                <Image className={style.image} src={userInfo.cover}></Image>
                            </View>
                        }
                        <View className={style.info}>
                            <View className={style.nickname}>{userInfo?.userName}
                                <Image className={style.sex} src={female}></Image><Image className={style.edit} src={edit}></Image></View>
                            <View className={style.labels}>
                                <Text>开心</Text>
                                <Text>快乐</Text>
                            </View>
                        </View >
                    </View >
                    <View className={style.rightMessage} onClick={() => { Jump.jump({ url: AppRoute.MODULES.SYSTEMNOTICE }) }}>
                        <Image className={style.mes} src={mes}>
                            <Text className={style.circle}></Text>
                        </Image>
                    </View>
                </View >
                <View className={style.main}>
                    <View className={`${style.centerCon} ${style.base}`}>
                        <View className={style.centerInfo}>
                            <View className={style.vertical}>
                                <View className={`${style.sc} ${style.icons}`}></View>
                                <Text>我的创作值</Text>
                            </View>
                            <View className={`${style.vertical} ${style.infos}`} onClick={() => { Jump.jump({ url: AppRoute.MODULES.CREATE }) }}>
                                <Image className={style.gold} src={badge}></Image>
                                <Text>6666</Text>
                                <Image className={style.arrow} src={arrow}></Image>
                            </View>
                        </View>
                        <View className={style.centerInfo}>
                            <View className={style.vertical}>
                                <View className={`${style.order} ${style.icons}`}></View>
                                <Text>我的订单</Text>
                            </View>
                            <View className={`${style.vertical} ${style.taps}`} onClick={() => { Jump.jump({ url: AppRoute.MODULES.ORDER }) }}>
                                <Image className={style.arrow} src={arrow}></Image>
                            </View>
                        </View>
                        <View className={`${style.centerInfo} ${style.noBorder}`}>
                            <View className={style.vertical}>
                                <View className={`${style.address} ${style.icons}`}></View>
                                <Text>地址管理</Text>
                            </View>
                            <View className={`${style.vertical} ${style.taps}`} onClick={() => { Jump.jump({ url: AppRoute.MODULES.ADDRESS }) }}>
                                <Image className={style.arrow} src={arrow}></Image>
                            </View>
                        </View>
                    </View>
                    <View className={`${style.centerAccount} ${style.centerCon} ${style.base}`}>
                        <View className={style.centerInfo}>
                            <View className={style.vertical}>
                                <View className={`${style.media} ${style.icons}`}></View>
                                <Text>社媒账号</Text>
                            </View>
                            <View className={`${style.vertical} ${style.taps}`} onClick={() => { Jump.jump({ url: AppRoute.MODULES.MEDIA }) }}>
                                <Image className={style.arrow} src={arrow}></Image>
                            </View>
                        </View>
                        <View className={`${style.centerInfo} ${style.noBorder}`}>
                            <View className={style.vertical}>
                                <View className={`${style.gift} ${style.icons}`}></View>
                                <Text>邀请有礼</Text>
                            </View>
                            <View className={`${style.vertical} ${style.taps}`} onClick={() => { Jump.jump({ url: AppRoute.MODULES.INVITE }) }}>
                                <Image className={style.arrow} src={arrow}></Image>
                            </View>
                        </View>
                    </View>
                    <View className={style.privacy}><Text>隐私协议</Text></View>
                </View>

            </>
            // <View className='center' onClick={this.handleClick}>个人中心页面</View>
        )
    }
}
